import React from "react"
import ReactDOM from "react-dom"
import { addErrorListener } from "../../lib/handleError"
import weixinShare from "../../lib/weixinShare"
import AJAX from "../../lib/ajax"
import Tools from "../../lib/tools"
import CONFIG from "../../lib/config"
import Clipboard from "clipboard"

require('./test.less')
require('../../styles/common.less')
require('../../styles/lux.less')
const Loading = require('../../components/Loading')
const Dialog = require('../MyPackage/components/Dialog')
const Toast = require('../MyPackage/components/Toast')

class App extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            code: "",
            text1: "",
            text2: "",
        }
        this.makeDevContent = this.makeDevContent.bind(this)
    }
    
    componentWillMount() {
        addErrorListener()()
        const param = Tools.getParams()
        //url里也没有 code
        if (!param.code) {
            AJAX.getWxCode()
        } else {
            const sid = Tools.readCookie("sid")
            this.setState({
                text1: `当前页面Cookie中的sid为${sid} `,
                code: `http://localhost:3000/test?code=${param.code}`
            })
        }
    }
    componentDidMount() {
        AJAX.appendBaiduAnalysis()
        new Clipboard('.btn')
    }
    makeSid() {
        AJAX.getWxSid((new_sid) => {
            this.setState({
                code: "该 code 已失效",
                text2: `重置当前页面的sid为${new_sid}`
            })
        })
    }
    info() {
        Dialog.info({
            title: "弹窗标题",
            content: "弹窗内容",
            okText: "确认",
            onOK: () => { }
        })
    }
    confirm() {
        Dialog.confirm({
            title: "标题",
            content: "内容",
            okText: "确认",
            cancelText: "取消",
            onOK: () => { },
            onCancel: () => { }
        })
    }
    warn() {
        Toast.warn({
            content: "警告"
        })
    }
    success() {
        Toast.success({
            content: "成功"
        })
    }
    error() {
        Toast.error({
            content: "失败"
        })
    }
    loading() {
        Toast.loading({
            content: "数据加载中"
        })
    }
    openLoading(mode) {
        this.setState({
            loading: true,
            loading_text: mode ? "更多识别" : "识别中"
        })
    }
    closeLoading() {
        this.setState({
            loading: false,
            loading_text: "识别中"
        })
    }
    copy() {
        Toast.success({
            content: "copy 成功"
        })
    }
    makeDevContent() {
        return (
            <div>
                <div className="weui-cell comment-textarea">
                    <div className="weui-cell__bd">
                        <textarea className="weui-textarea" placeholder="code" rows="3" value={this.state.code}></textarea>
                        <div className="weui-textarea-counter"></div>
                        <button className="btn weui-btn weui-btn_white textGray" data-clipboard-text={this.state.code}
                            onClick={this.copy.bind(this)}>
                            复制地址
                        </button>
                    </div>
                </div>
                <div className="weui-cell comment-textarea">
                    <div class="weui-cells__title">{this.state.text1}</div>
                </div>
                <div className="weui-cell comment-textarea">
                    <a href="javascript:;" class="weui-btn weui-btn_plain-default"
                        onClick={this.makeSid.bind(this)}
                    >点击生成SID</a>
                    <div class="weui-cells__title">{this.state.text2}</div>
                </div>
                <div className="weui-cell comment-textarea">
                    <a href="javascript:;" class="weui-btn weui-btn_plain-default"
                        onClick={this.info.bind(this)}
                    >点击弹窗info</a>
                </div>
                <div className="weui-cell comment-textarea">
                    <a href="javascript:;" class="weui-btn weui-btn_plain-default"
                        onClick={this.confirm.bind(this)}
                    >点击弹窗confirm</a>
                </div>
                <div className="weui-cell comment-textarea">
                    <a href="javascript:;" class="weui-btn weui-btn_plain-default"
                        onClick={this.warn.bind(this)}
                    >点击弹窗toast.warn</a>
                </div>
                <div className="weui-cell comment-textarea">
                    <a href="javascript:;" class="weui-btn weui-btn_plain-default"
                        onClick={this.success.bind(this)}
                    >点击弹窗toast.success</a>
                </div>
                <div className="weui-cell comment-textarea">
                    <a href="javascript:;" class="weui-btn weui-btn_plain-default"
                        onClick={this.error.bind(this)}
                    >点击弹窗toast.error</a>
                </div>
                <div className="weui-cell comment-textarea">
                    <a href="javascript:;" class="weui-btn weui-btn_plain-default"
                        onClick={this.loading.bind(this)}
                    >点击弹窗toast.loading</a>
                </div>
                <div className="weui-cell comment-textarea">
                    <a href="javascript:;" class="weui-btn weui-btn_plain-default"
                        onClick={()=>{
                            this.openLoading()
                            setTimeout(this.closeLoading.bind(this), 2000)
                        }}
                    >点击弹窗加载Loading</a>
                </div>
                <div className="weui-cell comment-textarea">
                    <a href="javascript:;" class="weui-btn weui-btn_plain-default"
                        onClick={()=>{
                            this.closeLoading()
                        }}
                    >点击关闭加载Loading</a>
                </div>
                <div className="weui-cell comment-textarea">
                    <a href="javascript:;" class="weui-btn weui-btn_plain-default"
                        onClick={()=>{
                            this.openLoading("more")
                        }}
                    >点击加载Loading</a>
                </div>
                <Loading show={this.state.loading} text={this.state.loading_text} / >
            </div>
        )
    }
    render() {
        let content = this.makeDevContent()
        return content
    }
}
ReactDOM.render(<App />, document.getElementById('app'))
if (module.hot) {
    module.hot.accept();
}